[Bug] Render Video editable loading / error states natively in Studio#3486
Merged
Conversation
The Video editable's in-progress and error placeholders were rendered by pimcore/pimcore as classic-UI markup with hardcoded references to /bundles/pimcoreadmin/img/video-loading.gif and filetype-not-supported.svg, plus inline editmode-iframe styling. These leaked into Studio's chrome (see screenshots in #3407) and the error state offered no edit affordance, leaving users unable to recover from a broken thumbnail config. Companion changes in pimcore/pimcore (12.3 + 2026.1) reduce those methods to minimal marker divs in Studio context. This change makes studio-ui-bundle render the actual UI on top: - detects .pimcore_editable_video_progress and .pimcore_editable_video_error markers in the editable container - renders a Spin overlay (with a dashed border matching the empty placeholder) over the in-progress marker - renders the same edit IconButton that's used on a rendered video over the error marker, so users can click through to the modal and pick a different asset / thumbnail config - polls a new studio-backend-bundle endpoint (/assets/{id}/video/thumbnail/{thumbnailName}/status) every 5s while in-progress and triggers an editor reload when the status flips to finished or error The thumbnail config name is now part of VideoEditableDefinition.config and threaded into the VideoEditable component as the thumbnailName prop. Resolves #3407
This was referenced May 5, 2026
Merged
|
… guard reload - extract renderEditButtonOverlay() shared by the error and rendered-video states - extract captureMarker() helper, removing 3x duplicated querySelector/setState blocks - centralize marker class names in MARKER_CLASS - guard triggerSaveAndReload() with a ref so it fires once per mount - narrow container with isNil (covers undefined)
… translations - show the data-message provided by the error marker inside the error overlay (it was previously preserved by the core PRs but never consumed) - only poll the thumbnail status for named thumbnail configurations, the editable config may also contain an inline configuration object - stop polling while the browser tab is unfocused - add the video.preview-in-progress translation to all remaining languages
The studio-backend video thumbnail status endpoint is now part of the committed OpenAPI schema, so the asset API slice is generated with the assetVideoThumbnailStatus query + VideoThumbnailStatus type. Drop the manual injectEndpoints() hand-injection (and its hand-written types) from the enhanced slice — the endpoint now comes straight from asset-api-slice.gen.ts.
Resolve assets/build/api/docs.jsonopenapi.json: take the latest 2025.4 schema (which does not yet include the video thumbnail status endpoint) and re-add the asset_video_thumbnail_status path + VideoThumbnailStatus schema on top, so the generated asset slice keeps the endpoint. Build artifacts taken from 2025.4 (CI regenerates them).
When the thumbnail finishes converting, the document state is unchanged (same asset reference) — there is nothing to save, the editable just needs to re-render. triggerSaveAndReload() runs an autosave, which the edit-lock gate holds until the first user edit; for a poll-triggered save with no prior edit that never resolves and the editor hangs on the reload overlay. Add a reload-only path (DocumentApi.reloadIframe -> iframeRef.reload()) and use it from the video editable. Avoids the autosave/edit-lock gate entirely and no longer requires save permission for the auto-refresh.
reloadIframe now flushes pending edits first when the document is modified (save-and-reload, as before — the edit-lock gate is already resolved in that case), and only does a plain reload when there is nothing to save. Keeps the original save-and-reload behavior where edits exist while still avoiding the edit-lock autosave gate hang for the no-edit case (e.g. opening a document whose video is already assigned and still converting).
…refresh The video editable's auto-refresh chose save-vs-reload from the redux `modified` flag, which is set via a deferred startTransition. A "finished" poll landing in the brief window right after a keystroke saw modified=false and took the reload-only path, discarding the just-typed (still unsaved) value. Record edited documents synchronously in triggerValueChange instead. Any document the user has touched is then always flushed via save-and-reload (which persists the live editable values and whose edit-lock gate is/will-be resolved, so it cannot hang), while never-edited documents keep the reload-only path. The flag is cleared after a save-and-reload and on unregister so a freshly reloaded, untouched document correctly reverts to reload-only.
Resolve conflict in video-editable.tsx: keep the renderEditButtonOverlay refactor (ours) and adopt the InheritanceOverlay -> EditableOverlay rename from 2025.4. Generated public/build artifacts taken from this branch; CI regenerates them on push.
…ock gate The gate is armed once on EditorContainer mount, not per iframe reload. The delete still stands (the reloaded document is a clean baseline, so a later refresh can take the cheap reload-only path), but the prior rationale was wrong.
't("video.edit")' had no translation key in any language (pre-existing), so the
tooltip showed the raw key. Reuse the generic 'edit' key, which is translated in
all 7 languages.
|
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to subscribe to this conversation on GitHub.
Already have an account?
Sign in.
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.







Changes in this pull request
Resolves #3407
Renders the Video editable's in-progress and error states with Studio-native UI instead of the classic-UI markup:
Companion PRs